<template>
    <el-dialog
    title="提示"
    :visible.sync="editroles"
    width="50%"
    :before-close="handleClose">
    <el-form  >
       <table>
          <tr>
            <td>角色名称</td>
            <td>
                <el-form-item ref="roleName">
                    <el-input v-model="defaultRole.roleName"></el-input>
                </el-form-item>
            </td>
        </tr>
        <tr>
            <td>角色</td>
            <td>
                <el-form-item ref="permissions">
                    <el-tree
                        :data="allPermissions"
                        show-checkbox
                        default-expand-all
                        node-key="permissionDesc"
                        ref="tree"
                        highlight-current
                        :props="defaultProps">
                    </el-tree>
                </el-form-item>
            </td>
        </tr>
        </table> 
    </el-form>
    <span slot="footer" class="dialog-footer">
        <el-button @click="$parent.editroles = false">取 消</el-button>
        <el-button type="primary" @click="$parent.editroles = false,updataRolePomission()">确 定</el-button>
        <!-- {{defaultRole}} -->
    </span>
    
    </el-dialog>
    
</template>
<script>
export default {
    props:['editroles','defaultRole'],
    data(){
        return {
            editroleInfos:{},
            defaultProps: {
            children: 'children',
            label: 'permissionDesc'
            },
            refs:{}
        }
    },
    computed:{
        allPermissions(){
           var permission = [];
            var obj=this.$store.getters.allPermissions;
            for(var key in obj){
               permission.push(obj[key])
            }
            // console.log(permission)
            return permission
           
        },
    },
    methods:{
        handleClose(){
             this.$parent.editroles = false;
        },
        updataRolePomission(){
            var rolepomission =[];
            console.log(this.$refs.tree)
            this.$refs.tree.getCheckedNodes().forEach((item)=>{
                rolepomission.push(item._id)
            })
            var params = {
                permissions:this.defaultRole.permissions,
                roleName:this.defaultRole.roleName,
                id:this._id
            }
        
            this.$http.post(this.$apis.updataRoleInfo,params)
            .then((resp)=>{
                this.$message({
                    message:resp.data.message,
                    type:resp.success?"success":"danger"
                });
                
            
            });
        
        }
    },
    watch:{
        defaultRole(newvalue){
            setTimeout(()=>{
            var defaultpromission = [];
            var newpro = [];
            var obj=this.$store.getters.allPermissions;
            for(var key in obj){
               newpro.push(obj[key])
            }
            // console.log(newpro)
            newpro.forEach((item) => {
                if(newvalue.permissions.indexOf(item._id)!=-1){
                    defaultpromission.push(item);
                }
            });
            
            this.$refs.tree.setCheckedNodes(defaultpromission)
            },0)
        },
        
    }

}
</script>
<style lang="scss" scoped>

</style>

